<template>
	<view class="all">
		<view v-for="(item,index) in dataList" :key="item.groupName" >
			<!-- <view class="group">
				<text style="font-size:30rpx;color:#aaaaaa">{{item.groupName}}</text>
			</view> -->
			<list>
				<!-- 注意事项: 不能使用 index 作为 key 的唯一标识 -->
				<cell v-for="(items, index) in item.chirder" :key="indexs">
					<view >
						<view class="groupitem">
							<image src="../../static/yyt.jpg" class="head"></image>
							<view class="textitem">
								<text class="name">{{items.name}}</text>
								<text class="content">{{items.content}}</text>
							</view>
						</view>
					</view>
					
				</cell>
			</list>
		</view>
	</view>
</template>

<script>
	export default {
		data () {
		   return {
		     dataList:[{
					id: 1,
					groupName: "A",
					num: 8,
					sum: 200,
					isShowList:false,
					chirder: [{
						id: 11,
						name: "lili",
						content: "朋友还就不见",
						time: "2020-05-29"
						}]
					},
				{
					id: 2,
					groupName: "B",
					num: 2,
					sum: 10,
					isShowList:false,
					chirder: [{
						id: 21,
						name: "书法",
						content: "朋友还就不见",
						time: "2020-05-29"
						}, {
						id: 22,
						name: "lili",
						content: "朋友还就不见",
						time: "2020-05-29"
						}]
				}]
		    }
		},
		
		methods: {
			
		}
	}
</script>

<style>
	page {
			background-color: #ffffff;
			padding-bottom: 30upx;
					
		}
	.all{
		margin:20px;
		
	}
	.textitem{
		display: flex;
		flex-direction: column;
	}
	.groupitem{
		display: flex;
		flex-direction: row;
		padding-left:20px;
		border: 2upx solid  #aaaaaa;
		margin-top: 10px;
		padding-top: 10px;
		padding-bottom: 10px;
		border-radius: 10px;
	}
	.head{
		width:60px;
		height:60px;
		border-radius: 40px;
	}
	.name{
		font-size: 35rpx;
		font-weight: bold;
		color: #474747;
		padding-top:10upx;
		padding-left:20px;
	}
	.content{
		font-size: 25rpx;
		color: #474747;
		padding-top:20upx;
		padding-left:20px;
	}
</style>
